<div class='module-sequence-padding'></div>
<div class='module-sequence-footer' role="navigation" aria-label="{{#t}}Module Navigation{{/t}}">
  <div class="module-sequence-footer-content">
    {{#if previous.show}}
      <a
        href="{{previous.url}}"
        role="button"
        class="Button module-sequence-footer-button--previous"
        data-tooltip="right"
        data-html-tooltip-title="{{previous.tooltip}}"
        aria-describedby="msf{{instanceNumber}}-previous-desc"
      >
        <i class="icon-mini-arrow-left"></i>{{#t 'previous'}}Previous{{/t}}
        <span id="msf{{instanceNumber}}-previous-desc" class="hidden" hidden>{{previous.tooltipText}}</span>
      </a>
    {{/if}}

    {{#if next.show}}
      <span class="module-sequence-footer-button--next" data-tooltip="left" data-html-tooltip-title="{{next.tooltip}}">
        <a
          href="{{next.url}}"
          role="button"
          class="Button"
          aria-describedby="msf{{instanceNumber}}-next-desc"
          aria-disabled={{next.modules_tab_disabled}}
          {{ disabledIf next.modules_tab_disabled }}
        >
          {{#t 'next'}}Next{{/t}}<i class="icon-mini-arrow-right"></i>
          <span id="msf{{instanceNumber}}-next-desc" class="hidden" hidden>{{next.tooltipText}}</span>
        </a>
      </span>
    {{/if}}
  </div>
</div>
